<template name="trailerStars">
	<view class="movie-score-wapper">
		<image src="https://img0.baidu.com/it/u=708741301,1715789282&fm=26&fmt=auto&gp=0.jpg" class="star-ico" 
			v-for="(sel,index) in selScore">
		</image>
		
		<image src="https://img2.baidu.com/it/u=2023032979,368156626&fm=26&fmt=auto&gp=0.jpg" class="star-ico"
			v-for="(unSel,index) in unSelScore"
		>
		</image>
		<view class="movie-score" v-if="showScore==1">
			{{score}}
		</view>
	</view>
</template>

<script>
	export default {
		name: "trailerStars",
		data(){
			return {
				selScore: 0,
				unSelScore: 5
			}
		},
		props: {
			score: 0,
			showScore: 0
		},
		created() {
			var temScore = 0;
			if(this.score){
				temScore = this.score;
			}
			
			this.selScore = parseInt(temScore/2);
			this.unSelScore = 5 - this.selScore;
			
			
		}
		
		
	}
</script>

<style>
	.movie-score-wapper {
		display: flex;
		flex-direction: row;
	}
	
	.star-ico {
		width: 20upx;
		height: 20upx;
		margin-top: 6upx;
	}
	.movie-score {
		font-size: 12px;
		margin-left: 10upx;
		color: grey;
	}
</style>
